
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="app">
    <div>{{msg}}</div>
    <button @click=del>销毁</button>
  </div>
  <script type="text/javascript" src="js/vue.js"></script>
  <script type="text/javascript">
    var vm = new Vue({
      el: '#app',
      data: {
        msg: '生命周期',
        timeid:""
      },
      methods: {
        del(){
          this.$destroy()
        }
      },
      mounted: function(){
        window.addEventListener('resize', function(){
          console.log('窗口大小发生了变化')
        })
        this.timeid=setInterval(function(){
          console.log('interval...')
        }, 1000)
      },
      destroyed(){
        console.log("销毁");
        clearInterval(this.timeid)
        window.removeEventListener("resize",function(){
          console.log('窗口大小发生了变化')
        },false)
      }
    });
    // 我在组件挂载完成的时候, 启动了一个定时器, 每隔1s打印一句话, 并且我还对窗口大小变化的事件进行了监听
    // 我想在组件销毁的时候, 将定时器取消, 并且将resize的监听取消, 该怎么实现代码
  </script>
</body>
</html>
